import React, {Component} from "react";
import {inject, observer} from "mobx-react";
import {action} from "mobx";
import {Link} from "react-router-dom";
import ActivityListItem from "./ActivityListItem"

@inject("activityStore")
@observer
class ActivityList extends Component {
    constructor(props) {
        super(props);
    }

    @action componentDidMount() {
        this.props.activityStore.activities.clear();
        if (this.props.activityStore.getActivityType() === 1) {
            this.props.activityStore.fetchYearActivityList();
        } else if (this.props.activityStore.getActivityType() === 0) {
            this.props.activityStore.fetchNorActivityList();
        }
    }

    @action goBack = () => {
        this.props.activityStore.setActivityType(-1);
    };

    render() {
        const type = this.props.activityStore.getActivityType();
        const activities = this.props.activityStore.activities;
        return (
            <div>
                <div>
                    {type === 1 ? (<div>查看值年活动</div>) : (<div>查看普通活动</div>)}
                </div>
                <div>
                    {activities.map(item=> (
                        <Link key={item.id} to={`/viewActivity/${item.id}`}>
                            <ActivityListItem activity={item}/>
                        </Link>
                    ))}
                </div>
                <div>
                    <button onClick={this.goBack}>返回</button>
                </div>
            </div>
        );
    }
}

export default observer(ActivityList);
